<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>会员管理</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" type="text/css" href="{:C('WEB_URL')}Public/business/style/style.css" />
<link rel="stylesheet" type="text/css" href="{:C('WEB_URL')}Public/business/style/bootstrap.min.css" />
<link rel="stylesheet" href="{:C('WEB_URL')}Public/business/style/mui.min.css">
<script src="{:C('WEB_URL')}Public/business/js/mui.min.js"></script>
<script type="text/javascript" charset="UTF-8" src="{:C('WEB_URL')}Public/business/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" charset="UTF-8" src="{:C('WEB_URL')}Public/business/js/bootstrap.min.js"></script>
<script type="text/javascript" charset="UTF-8" src="{:C('WEB_URL')}Public/business/js/script.js"></script>


</head>
<body>
<header class="mui-bar mui-bar-nav" style="background-color: #fff;">
	<a href="index.html"><p class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></p></a>
	<h1 class="mui-title">会员管理</h1>
	<if condition="$list2.purview eq 0">
	<h6><a id="menu" class="mui-action-menu mui-icon mui-icon-bars mui-pull-right" href="#topPopover"></a></h6>
	<else />
	</if>
</header>
<div class="mui-content">
    <div id="slider" class="mui-slider mui-fullscreen">
	    <div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
		    <div class="mui-scroll">
				<a class="mui-control-item mui-active" href="#item1mobile">日期排序</a>
				<a class="mui-control-item" href="#item2mobile">账号排序</a>
				<a class="mui-control-item" href="#item3mobile">消费优先</a>
			</div>
		</div>
		<div class="mui-slider-group" id="pullrefresh">
		    <div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
				<div id="scroll1" class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<ul class="mui-table-view" >
							<input type="hidden" value＝"1" attr='1' />
							<volist name="data" id="vo">
							<li class="mui-table-view-cell info"><a href="{:U('Business/memberDetails?id='.$vo[user_id])}">
								<div class="alo">

									<div class="aloLeft">
										<img src="{:C('WEB_URL')}Public/business/images/member_03.jpg" />
									</div><!--aloLeft-->
									<div class="aloCenter">
										<p class="memberName">{$vo.nick_name}</p>
										<p>NO.{$vo.id}</p>
									</div><!--aloCenter-->
									<div class="aloRight">
									<!--	<p id="lasttime"><span>nickname</span></p>-->
										<!--<script>
											var a=$('.aloRight p span').html()/86400;
											var b=Math.ceil(a);
										
											$('.aloRight p span').html(Math.ceil(a));
										</script>-->
			
									</div><!--aloRight-->
									<p class="aloManage"><img src="{:C('WEB_URL')}Public/business/images/manage_11.jpg" />会员折扣还剩:{$vo.count}次<span><notempty name="vo.user_name">
									电话 ：{$vo.user_name}
									</notempty></span></p>
								</div><!--alo--></a>
							</li>
							</volist>
						</ul>
					</div>
				</div>
			</div>
			<div id="item2mobile" class="mui-slider-item mui-control-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<ul class="mui-table-view">
							<input type="hidden" value＝"1" attr='1' />
							<input type="hidden" value＝"1" attr='1' />
							<volist name="data1" id="vo1">
						<li class="mui-table-view-cell info"><a href="{:U('Business/memberDetails?id='.$vo[user_id])}">
								<div class="alo">

									<div class="aloLeft">
										<img src="{:C('WEB_URL')}Public/business/images/member_03.jpg" />
									</div><!--aloLeft-->
									<div class="aloCenter">
										<p class="memberName">{$vo1.nick_name}</p>
										<p>NO.{$vo1.id}</p>
									</div><!--aloCenter-->
									<div class="aloRight">
									<!--	<p id="lasttime"><span>nickname</span></p>-->
										<!--<script>
											var a=$('.aloRight p span').html()/86400;
											var b=Math.ceil(a);
										
											$('.aloRight p span').html(Math.ceil(a));
										</script>-->
			
									</div><!--aloRight-->
									<p class="aloManage"><img src="{:C('WEB_URL')}Public/business/images/manage_11.jpg" />会员折扣还剩:{$vo1.count}次<span><notempty name="vo1.user_name">
									电话 ：{$vo1.user_name}
									</notempty></span></p>
								</div><!--alo--></a>
							</li>
							</volist>
							
						</ul>
					</div>
				</div>
			</div>
			<div id="item3mobile" class="mui-slider-item mui-control-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<ul class="mui-table-view">
							<input type="hidden" value＝"1" attr='1' />
							<input type="hidden" value＝"1" attr='1' />
							<input type="hidden" value＝"1" attr='1' />
							<volist name="data2" id="vo2">
							<li class="mui-table-view-cell info"><a href="{:U('Business/memberDetails?id='.$vo[user_id])}">
								<div class="alo">

									<div class="aloLeft">
										<img src="{:C('WEB_URL')}Public/business/images/member_03.jpg" />
									</div><!--aloLeft-->
									<div class="aloCenter">
										<p class="memberName">{$vo2.nick_name}</p>
										<p>NO.{$vo2.id}</p>
									</div><!--aloCenter-->
									<div class="aloRight">
									<!--	<p id="lasttime"><span>nickname</span></p>-->
										<!--<script>
											var a=$('.aloRight p span').html()/86400;
											var b=Math.ceil(a);
										
											$('.aloRight p span').html(Math.ceil(a));
										</script>-->
			
									</div><!--aloRight-->
									<p class="aloManage"><img src="{:C('WEB_URL')}Public/business/images/manage_11.jpg" />会员折扣还剩:{$vo2.count}次<span>
									<notempty name="vo2.user_name">
									电话 ：{$vo2.user_name}
									</notempty>
									</span></p>
								</div><!--alo--></a>
							</li>
							</volist>
							
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<if condition="$list2.purview eq 0">
  <div class="navbar navbar-default navbar-fixed-bottom">	
   <footer id="foot">
    <dl>
     <dt><a href="index.html"><img src="{:C('WEB_URL')}Public/business/images/home.png" /></a></dt>
     <dd><a href="index.html" class="current">首页</a></dd>
    </dl>
    <dl>
     <dt><a href="pullrefresh_sub.html"><img src="{:C('WEB_URL')}Public/business/images/deal_07.jpg" /></a></dt>
     <dd><a href="pullrefresh_sub.html">员工管理</a></dd>
    </dl>
    <dl>
     <dt><a href="manage.html"><img src="{:C('WEB_URL')}Public/business/images/deal_09.jpg" /></a></dt>
     <dd><a href="manage.html">会员管理</a></dd>
    </dl>
   </footer>
   
  </div><!--/navbar-->
 	<else />
    </if>
</div>
<div id="topPopover" class="mui-popover" style="width:160px;">
 <div class="mui-popover-arrow"></div>
 <div class="mui-scroll-wrapper">
  <div class="mui-scroll">
   <ul class="mui-table-view">
	<li class="mui-table-view-cell"><a href="discountErwei.html" class="manages"><img src="{:C('WEB_URL')}Public/business/images/member_04.jpg" />消费二维码</a></li>
    <li class="mui-table-view-cell"><a href="payErwei.html" class="manages"><img src="{:C('WEB_URL')}Public/business/images/member_06.jpg" />购买卡券</a></li>
	<li class="mui-table-view-cell"><a href="addMember.html" class="manages"><img src="{:C('WEB_URL')}Public/business/images/member_10.jpg" />添加员工</a></li>
   </ul>
  </div>
 </div>
</div>

<script src="{:C('WEB_URL')}Public/business/js/mui.pullToRefresh.js"></script>
<script src="{:C('WEB_URL')}Public/business/js/mui.pullToRefresh.material.js"></script>
<script> 

//最下面点击效果
$('#foot dl').on("touchstart",function(){
  // alert(1);
  $('#foot dl').css("background-color","#fff")
  $(this).css("background-color","#ddd")
})
$('#foot dl').on("touchend",function(){
  // alert(1);
  $('#foot dl').css("background-color","#fff")

})
//微信判断header是否显示
if(isWeiXin()){ 
//alert("====");
$(".mui-title").hide();
} 
else{
//alert("+++++");
};

//mui(".mui-table-view").on('tap','.mui-table-view-cell',function(){
////获取id
//var id = this.getAttribute("info");
////传值给详情页面，通知加载新数据
//mui.fire(memberDiv,'getDetail',{info:memberDiv});
////打开新闻详情
//mui.openWindow({
//  id:'memberDiv',
//  url:'memberDetails.html'
//});
//})

//mui(".mui-table-view").on('tap','.mui-table-view-cell',function(){
//	//打开关于页面
//	mui.openWindow({
//	url: 'memberDetails.html', 
//	id:'info'
//	});
//});

mui.init();
			(function($) {
				//阻尼系数
				var deceleration = mui.os.ios?0.003:0.0009;
				$('.mui-scroll-wrapper').scroll({
					bounce: false,
					indicators: true, //是否显示滚动条
					deceleration:deceleration
				});
				$.ready(function() {
					//循环初始化所有下拉刷新，上拉加载。
					$.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
						$(pullRefreshEl).pullToRefresh({
							down: {
								callback: function() {
									var self = this;
									setTimeout(function() {
										var ul = self.element.querySelector('.mui-table-view');
										createFragment(ul, index, 4, true);
										top.location.reload();//刷新本页面
									}, 1000);
								}
							},
							up: {
								callback: function() {
									var self = this;
									setTimeout(function() {
										var ul = self.element.querySelector('.mui-table-view');
										createFragment(ul, index, 10);
										self.endPullUpToRefresh();
									}, 1000);
								}
							}
						});
					});
					
					var createFragment = function(ul, index, count) {
						var length = ul.querySelectorAll('li').length;
						var param=ul.querySelectorAll('input').length;
						var fragment = document.createDocumentFragment();
				
						var li;
						$.ajax({
						  type:'POST',
						  url:'employeeRefresh'+param,
						  dataType: "json",
						  data: 'limit='+length,
						  success:function(data){
							  console.log(data);
								$.each(data, function(index, item){
								li = document.createElement('li');
								li.className = 'mui-table-view-cell';
								li.innerHTML = '<a href="memberDetails?id='+item.user_id+'"><div class="alo"><div class="aloLeft"><img src="{:C('WEB_URL')}Public/business/images/member_03.jpg" /></div><div class="aloCenter"><p class="memberName">'+item.nick_name+'</p><p>NO.'+item.id+'</p></div><div class="aloRight"></div><p class="aloManage"><img src="{:C('WEB_URL')}Public/business/images/manage_11.jpg" />会员折扣还剩：'+item.user_id+'次 <span>电话：'+item.user_name+'</span></p></div></a>';
								ul.appendChild(li);
								
                             	
                         });		
							
						  	}
						 })
							return ul;
					};
				});
			})(mui);
			

		</script>
	</body>
</html>